<html>
<head>

<style type="text/css">
p.top
{
border-top-style: solid;
border-top-color: #0000ff
}
p.left
{
border-left-style: solid;
border-left-color: #ffff00
}
p.right
{
border-right-style: solid;
border-right-color: #ff00ff
}
p.bottom
{
border-bottom-style: solid;
border-bottom-color: #ff0000
}

p.vertical {
border-top-style: solid;
border-top-color: #0000ff;
border-bottom-style: solid;
border-bottom-color: #ff0000
}
p.all {
border-style: solid;
border-color: #aaaaaa;
}

</style>


</head>

<body>

<p class="top">Top border!</p>

<p class="left">Left border</p>

<p class="right">Right border!</p>

<p class="bottom">Bottom border</p>
<br>
<br>
<p class="vertical">Top and bottom</p>
<br>
<br>
<p class="all">All borders</p>

<p><b>Note:</b> The "border-color" property does not work if it is used alone. Use the "border-style" property to set the borders first.</p>

</body>
</html>

